$(function(){

    /* 添加一条banner */
    $('#J_add').on('click', function() {
        var tbody = $('#J_tbody');
        var len = tbody.children('tr').length + 1;
        if(len > 5) {
            layer.alert('最多可以上传5个轮播图!');
            return false;
        }
        var html = '<tr>' +
            '<td>' + len + ' <input type="hidden" name="banner['+ len +'][id]" value="' + len +' "></td>' +
            '<td><div class="tdpic"><input type="file" id="J_upload_new'+ len +'" class="uploadfile J_upload"  name="upload"><span class="btn btn-app"><i class="glyphicon glyphicon-plus"></i></span><p class="notice J_notice">图片尺寸：750x300</p>' +
            '<input type="hidden" name="banner[' + len +'][img]" class="J_img_hideval"></div>' +
            '<td><textarea type="text" rows="5"  class="form-control edit-form-control J_edit_form_control J_url" name="banner['+ len +'][url]"></textarea></td>' +
            '<td><input type="text" value="0" name="banner[' + len +'][order]  edit-form-control J_edit_form_control" class="form-control"> </td>' +
            '<td><textarea type="text" rows="5"  class="form-control edit-form-control J_edit_form_control" name="banner['+ len +'][remark]"></textarea></td>' +
            '<td></td>' +
            '<td><a class="J_del">删除</a></td>';
        $('#J_tbody').append(html);
    });

    $('#J_tbody').on('click', '.J_edit_form_control', function() {
        var $this = $(this);
        $this.attr('readonly', false).focus();
    });

    $('#J_tbody').on('blur', '.J_edit_form_control', function() {
        var $this = $(this);
        if($.trim($this.val()).length > 0) {
            $this.attr('readonly', true);
        }
    });

    function singleImageUpload(id, url, data, callbackFn){
        var filename = $("#" + id).val().split('/').pop().split('\\').pop();

        if (!/\.(gif|jpg|jpeg|png|GIF|JPG|PNG)$/.test(filename)) {
            alert('图片类型必须是.gif,jpeg,jpg,png中的一种');
            $("#" + id).val('');
            return false;
        }

        var options = {
            url: url +'?t=' + new Date(), //用于文件上传的服务器端请求地址
            secureuri: false, //是否需要安全协议，一般设置为false
            fileElementId: id, //文件上传域的ID
            data: data,
            dataType: 'json', //返回值类型 一般设置为json
            success:function(data, status){ //服务器成功响应处理函数
                // data = {
                //     "msg":  "反馈消息",
                //     "error": "1",  1表示上传出错， 0表示上传成功
                //     "src": "图片路径"
                // }
                callbackFn && callbackFn(data);
            },
            error: function(){
                layer.alert('上传图片请求失败，请重试！');
                return false;
            }
        };

        $.ajaxFileUpload(options);
    }

    // 上传图片
    $('#J_tbody').off("change", '.J_upload').on('change', '.J_upload', function() {
        var id = $(this).attr('id');
        var $this = $(this);
        var parent = $this.parent();
        var data = {};

        data.id = $(this).attr('data-id') ? $(this).attr('data-id') : -1;

        singleImageUpload(id, AJAXCONFIG.uploadUrl, data, function(data) {
            if(data.status == 1) {
                var html = '<img src="' + data.img + '" >';
                if(parent.find('.btn').length > 0) {
                    parent.find('.btn').replaceWith(html);
                    parent.find('.J_notice').remove();
                } else {
                    parent.find('img').replaceWith(html);
                }
                parent.find('input[type=file]').attr('data-id', data.id);
                parent.find('input[type=hidden]').val(data.id);
                layer.alert('上传成功！', {icon:1});
                // parent.empty().append(html);
            }
        })
    });


    // 删除
    $('#J_tbody').on('click', '.J_del', function(ev) {
        ev.preventDefault();
        var href = $(this).attr('href');
        var $this = $(this);
        if(href.length > 0) {
            layer.confirm('你确定要删除吗？', function() {
                $.ajax({
                    url: href,
                    type: 'post',
                    data: {_csrf: GLOBAL.base.getCsrfToken()},
                    dataType: 'json',
                    success: function(data) {
                        if (data.status == 1) {
                            layer.alert('删除成功！');
                            $this.parents('tr').remove();
                        }
                    }
                })
            });
        } else {
            $(this).parents('tr').remove();
        }


        return false;
    });

    function checkSubmit() {
        var flag = true;
        var imgs = $('.J_img_hideval');
        var urls = $('.J_url');

        for(var i = 0; i < imgs.length; i++) {
            if(imgs[i].value == '') {
                flag = false;
                alert('请上传图片');
                return false;
            }
        }

        for(var i = 0; i < urls.length; i++) {
            if(urls[i].value == '') {
                flag = false;
                $(urls[i]).addClass('error');
                layer.alert('请输入URL',{icon:2});
                return false;
            }
        }

        return flag;
    }

    $('#J_save').on('click', function() {
        if(checkSubmit()) {
            $('#J_form').submit();
        }
    });


});
